<template>
  <div class="DeskApp fs12">
    <div class="p10 txt-blue">在桌面新增一个App，代码怎么写呢？</div>
    <div class="p0-10">
      <CodeArea v-if="dt" :dt="dt" format="javascript" />
      <div class="p10-0">children内可嵌套app</div>
    </div>
  </div>
</template>
<script>
export default {
  name: "DeskApp",
  data() {
    return {
      dt: "",
    }
  },
  created() {
    this.init()
    console.info("DeskApp loaded");
  },
  methods: {
    init() {
      this.dt = `
        let apps = [] //所有app的集合设置变量
        // ↓ 一个app的模版 ↓
        // 所有的可供点击的窗口 都是一个app
        {
          name: "monitor", // 唯一标识 当做key
          meta: {
            label: "使用要素", // 展示出的名称
            icon: "monitor", // 要使用的图标
            type: "folder", // app类型，此处folder为文件夹
          },
          component: () => import("../../views/A/A.vue"), // views内的组件
          children: [], // 子级，只有type为folder，才会有子级
        }
      `
    },
  },
}
</script>
<style lang="scss" scoped></style>
